<section>
  <p class="item">{{ data.email }}</p>
  <p class="password item">{{ data.password }}</p>
  <div class="role"><p *ngFor="let Role of data.roles">{{ Role.name.toLowerCase() }}</p></div>
  <div class="item buttons">
    <button class="ax-button" data-id="{{data.id}}" (click)="handleDeleteEvent($event)">

      <svg width="35" height="35" viewBox="0 0 35 35" fill="none" xmlns="http://www.w3.org/2000/svg">
        <path fill-rule="evenodd" clip-rule="evenodd"
              d="M4.80214 4.80214C5.37165 4.23262 6.29502 4.23262 6.86453 4.80214L17.5 15.4376L28.1355 4.80214C28.705 4.23262 29.6283 4.23262 30.1979 4.80214C30.7674 5.37165 30.7674 6.29502 30.1979 6.86453L19.5624 17.5L30.1979 28.1355C30.7674 28.705 30.7674 29.6283 30.1979 30.1979C29.6283 30.7674 28.705 30.7674 28.1355 30.1979L17.5 19.5624L6.86453 30.1979C6.29502 30.7674 5.37165 30.7674 4.80214 30.1979C4.23262 29.6283 4.23262 28.705 4.80214 28.1355L15.4376 17.5L4.80214 6.86453C4.23262 6.29502 4.23262 5.37165 4.80214 4.80214Z"
              fill="#B85526"/>
      </svg>

    </button>
    <button class="ax-button" data-id="{{data.id}}" (click)="handleEditEvent($event)">

      <svg width="35" height="35" viewBox="0 0 35 35" fill="none" xmlns="http://www.w3.org/2000/svg">
        <path fill-rule="evenodd" clip-rule="evenodd"
              d="M23.1108 2.91669C23.4978 2.91661 23.8689 3.07035 24.1425 3.34405L29.469 8.67287C30.0382 9.24233 30.0382 10.1653 29.469 10.7348L14.3878 25.8227C14.1142 26.0963 13.7432 26.25 13.3563 26.25H8.02087C7.21546 26.25 6.56254 25.5971 6.56254 24.7917V19.4833C6.56254 19.0968 6.71595 18.7261 6.98906 18.4527L22.0792 3.34444C22.3527 3.07064 22.7238 2.91676 23.1108 2.91669ZM23.1114 6.43826L9.47921 20.0868V23.3334H12.7521L26.3756 9.70385L23.1114 6.43826ZM3.64587 30.625C3.64587 29.8196 4.29879 29.1667 5.10421 29.1667H31.3542C32.1596 29.1667 32.8125 29.8196 32.8125 30.625C32.8125 31.4304 32.1596 32.0834 31.3542 32.0834H5.10421C4.29879 32.0834 3.64587 31.4304 3.64587 30.625Z"
              fill="#B85526"/>
      </svg>

    </button>
  </div>
</section>
